<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Text Page</title>
    <link rel="stylesheet" href="./css/style.css">  
</head>
<body>
    <h1>Text Page</h1>
    <p>This is the text page for the web application.</p>   

    <div class="color">
        <p>This text is red.</p>
    </div>
    <div class="letter-spacing">
        <p>This text has increased letter spacing.</p>
    </div>
    <div class="line-height">
        <p>This text has increased line height.</p>
    </div>
    <div class="text-align">
        <p>This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.
            This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.
            This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.This text is center aligned.
        </p>
    </div>
    <div class="text-decoration">
        <p class="none">This text is none.</p>
        <p class="overline">This text is overline.</p>
        <p class="underline">This text is underlined.</p>
        <p class="line-through">This text is line through.</p>
    </div>
    <div class="text-indent">
        <p>This text is indented. This text is indented. This text is indented. This text is indented. This text is indented. This text is indented.</p>
        <p>This text is indented. This text is indented. This text is indented. This text is indented. This text is indented. This text is indented.</p>
    </div>
</body>
</html>